<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>Search</title>
    </h:head>
    <h:body>
        <ui:composition template="./templateuser.xhtml">
            <ui:define name="center">
                <h:form id="form">
                    
                    <p:panel header="Search">
                        <h:panelGrid columns="4" id="searchGrid">
                            
                            <h:outputLabel for="username">Search by username:</h:outputLabel>
                            <p:inputText id="username" value="#{searchBean.username}">
                                <p:ajax update="usernamemsg"/>
                            </p:inputText>
                            <p:message id="usernamemsg" for="username" />
                            <p:commandButton value="Search" update="searchGrid,resultslist"
                                         action="#{searchBean.search()}" />
                            
                        </h:panelGrid>
                        
                    </p:panel>
                    
                    <p:dataList id="resultslist" value="#{searchBean.users}" var="user" type="unordered" itemType="none" paginator="true" rows="10" styleClass="paginated">
                        <f:facet name="header">
                            Results
                        </f:facet>
                        <p:commandLink update=":form:userDetail" oncomplete="PF('userDialog').show()" title="View Detail" styleClass="ui-icon ui-icon-search" style="float:left;margin-right:10px">
                            <f:setPropertyActionListener value="#{user}" target="#{searchBean.selectedUser}" />
                            <h:outputText value="#{user.username}" />
                        </p:commandLink>
                        <p:commandLink title="ViewProfile" update="resultslist" action="#{searchBean.viewProfile()}" >
                            <f:setPropertyActionListener value="#{user}" target="#{searchBean.selectedUser}" />
                            <h:outputText value="#{user.username}" />
                        </p:commandLink>
                    </p:dataList>

                    <p:dialog header="User Info" widgetVar="userDialog" showEffect="blind" hideEffect="explode" resizable="false">
                        <p:outputPanel id="userDetail" style="text-align:center;">
                            <p:panelGrid  columns="2" rendered="#{not empty searchBean.selectedUser}" columnClasses="label,value">
                                <f:facet name="header">
                                     
                                </f:facet>

                                <h:outputText value="Username:" />
                                <h:outputText value="#{searchBean.selectedUser.username}" />

                                <h:outputText value="Name:" />
                                <h:outputText value="#{searchBean.selectedUser.name}" />

                                <h:outputText value="Surname:" />
                                <h:outputText value="#{searchBean.selectedUser.surname}" />

                            </p:panelGrid>
                        </p:outputPanel>
                    </p:dialog>
                         
                </h:form>
            </ui:define>
        </ui:composition>
    </h:body>
</html>